import React from 'react'
import { Routes, Route, Link, NavLink, useRoutes } from 'react-router-dom'

import routes from './routes'
// 需求: Home和Login是两个一级路由组件, Test是Home里面的二级路由组件.Test渲染在Home组件中hr下面
export default function App() {
  return (
    <div>
      {/* NavLink和Link组件的作用一致,但是会自动根据当前路径给a标签添加active类名.从而快速实现高亮 */}

      <NavLink to="/home">home</NavLink>
      <NavLink to="/login">login</NavLink>

      <hr />
      {/* useRoutes会自动根据传入的路由表生成Routes和Route */}
      {useRoutes(routes)}
    </div>
  )
}
